import {Tabs} from 'antd-mobile'
import './style.css'
import {useTabs} from "@/pages/Home/useTabs.ts";
import HomeList from "@/pages/Home/HomeList";

const Home = () => {
    const {channels} = useTabs();

    return (
        <div className="tabContainer">
            {/* tab区域 */}
            {/* defaultActiveKey 默认激活 */}
            <Tabs defaultActiveKey={"0"}>
                {channels.map(item => (
                    <Tabs.Tab title={item.name} key={item.id}>
                        {/* list 组件 */}
                        <div className="listContainer">
                            <HomeList channelId={"" + item.id}/>
                        </div>
                    </Tabs.Tab>
                ))}
            </Tabs>
        </div>
    )
}

export default Home